import { Modal } from "antd";
import { MaterialDataType } from "../types";

interface StatusModalProps {
  open: boolean;
  data: MaterialDataType | MaterialDataType[] | null;
  onClose: () => void;
  onConfirm: () => void;
  title?: string;
  content?: string;
  loading?: boolean;
}

export default function StatusModal({
  open,
  data,
  onClose,
  onConfirm,
  title,
  content,
  loading,
}: StatusModalProps) {
  if (!open) return null;

  const getModalProps = () => {
    return {
      title: title || "提示",
      onOk: onConfirm,
      onCancel: onClose,
      okText: "确认",
      cancelText: "取消",
      confirmLoading: loading,
    };
  };

  const renderContent = () => {
    if (content) {
      return (
        <div className="text-center">
          <div className="text-base">{content}</div>
        </div>
      );
    }

    if (!data) return null;

    return (
      <div className="text-center">
        <div className="text-base">
          {Array.isArray(data) ? (
            <span>
              确定要{data.length > 0 && data[0].status === "disabled" ? "开启" : "关闭"}以下素材吗？
              <br />
              <div className="mt-2 text-gray-600">共 {data.length} 条素材</div>
            </span>
          ) : (
            <span>确定要{data.status === "disabled" ? "开启" : "关闭"}此素材吗？</span>
          )}
        </div>
      </div>
    );
  };

  return (
    <Modal open={open} {...getModalProps()} width={460} centered closable={false}>
      {renderContent()}
    </Modal>
  );
}
